import React from 'react';

const ActionButtons = ({ 
  handleFeed, 
  handlePlay, 
  handleClean, 
  handleSleep,
  petState,
  gameInfo 
}) => {
  return (
    <div className="action-buttons" style={{
      display: 'flex',
      justifyContent: 'center',
      gap: '20px',
      marginTop: '20px'
    }}>
      <button
        onClick={handleFeed}
        disabled={petState.hunger >= 100}
        style={{
          padding: '15px',
          borderRadius: '10px',
          border: 'none',
          backgroundColor: '#FFE4B5',
          cursor: petState.hunger >= 100 ? 'not-allowed' : 'pointer'
        }}
      >
        🍖 喂食
      </button>
      
      <button
        onClick={handlePlay}
        disabled={petState.energy < 20}
        style={{
          padding: '15px',
          borderRadius: '10px',
          border: 'none',
          backgroundColor: '#98FB98',
          cursor: petState.energy < 20 ? 'not-allowed' : 'pointer'
        }}
      >
        🎮 玩耍
      </button>
      
      <button
        onClick={handleClean}
        style={{
          padding: '15px',
          borderRadius: '10px',
          border: 'none',
          backgroundColor: '#87CEEB',
          cursor: 'pointer'
        }}
      >
        🚿 清洁
      </button>
      
      <button
        onClick={handleSleep}
        style={{
          padding: '15px',
          borderRadius: '10px',
          border: 'none',
          backgroundColor: '#DDA0DD',
          cursor: 'pointer'
        }}
      >
        {petState.isSleeping ? '🌞 起床' : '😴 睡觉'}
      </button>
    </div>
  );
};

export default ActionButtons;